<template>
    <div>
        <el-container >
            <el-header >

            </el-header>
            <el-container style="height: 500px; border: 1px solid #eee">
                <el-aside width="200px">
                    <el-menu @select="menuClick"
                             background-color="#182450"
                             text-color="#fff">
                        <el-submenu index="1">
                            <template slot="title"><i class="el-icon-monitor" style="color: #09D1F0"></i>分级与用户</template>
                            <el-menu-item index="/test1"><i class="el-icon-user" style="color: #09D1F0"></i>下行单位管理</el-menu-item>
                            <el-menu-item index="/test2"><i class="el-icon-document-copy" style="color: #09D1F0"></i>角色管理</el-menu-item>
                            <el-menu-item index="/test3"><i class="el-icon-c-scale-to-original" style="color: #09D1F0"></i>用户管理</el-menu-item>
                        </el-submenu>
                    </el-menu>
                </el-aside>
                <el-main>
                    <router-view/>
                </el-main>
            </el-container>
        </el-container>
    </div>
</template>


<script>
    export default {
        name: 'HomeView',
        methods:{
            menuClick(index){
                this.$router.push(index);
            }
        }
    }
</script>


<style>
    .el-header {
        background: #101938;
        color: #FFFFFF;
        text-align: center;
        font-size:40px;

    }
    .el-aside {
        background-color: #182450;
        text-align: left;
    }
    .el-main {
        background-color: #242E66;
        color: #FFFFFF;
        text-align: left;

    }
</style>



